import 'package:flutter/material.dart';
import 'package:hockey/extensions/jzx_widget_extension.dart';
import 'package:hockey/jzx_apps.dart';
import 'package:locale_emoji/locale_emoji.dart' as le;

import 'controller.dart';

class JzxBlacklistView extends GetView<JzxBlacklistController> {
  const JzxBlacklistView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBodyBehindAppBar: true,
      appBar: const JzxAAppBar(title: 'BLOCK LIST'),
      body: Obx(() {
        if (controller.itmes.isEmpty) {
          return Center(
            child: Assets.images.icEmpty.image(width: 200.w),
          ).backgroud(Assets.images.normalBgv);
        }
        return ListView.separated(
          padding: EdgeInsets.only(top: 24 + kNavigationBarHeight),
          itemCount: controller.itmes.length,
          itemBuilder: (context, index) {
            final item = controller.itmes[index];
            return Container(
              height: 70.w,
              width: double.infinity,
              alignment: Alignment.center,
              margin: const EdgeInsets.only(left: 20, right: 20),
              padding: const EdgeInsets.symmetric(horizontal: 21),
              decoration: BoxDecoration(
                color: const Color(0x26FFFFFF),
                borderRadius: BorderRadius.circular(12),
              ),
              child: Row(
                children: [
                  JzxUserFrame(item.avatar, 48.w),
                  JzxGaps.w12,
                  Expanded(
                    child: Column(
                      mainAxisSize: MainAxisSize.min,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          item.nickName,
                          style: myAppColors.white.font_14.medium,
                          maxLines: 1,
                        ),
                        JzxGaps.h5,
                        Text(
                          '${le.getFlagEmoji(countryCode: item.registerCountry.ab)}',
                          style: const TextStyle(fontSize: 15),
                        ),
                      ],
                    ),
                  ),
                  JzxGaps.w20,
                  InkWell(
                    onTap: () {
                      controller.removeUser(index);
                    },
                    child: Assets.images.icCancelBlack.image(width: 28.w),
                  ),
                ],
              ),
            );
          },
          separatorBuilder: (context, index) => JzxGaps.h20,
        ).backgroud(Assets.images.normalBgv);
      }),
    );
  }
}
